<template>
	<view class="container">
		<view class="fixedTop">
			<view class="barClass" :style="{ height: `${statusBarHeight}px` }"></view>
			<view class="header">
				<view class="header-user">
					<view class="header-left">
						<image v-if="userInfo.head_pic" :src="userInfo.head_pic" class="head_pic"></image>
						<image v-else src="../../static/imgs/mine/user-header.png" class="head_pic"></image>
						<view class="header-msg">
							<view class="header-msg_tips">
								{{userInfo.nickname}}
								<image src="../../static/imgs/mine/vip-icon.png"></image>
							</view>
							<view class="header-msg_num">手机号：{{userInfo.mobile?userInfo.mobile:'***********'}}</view>
						</view>
					</view>
					<view class="list-item-info" @click="hrefAccount">
						<image src="../../static/imgs/mine/user-info.png"></image>
					</view>
				</view>
				<!-- <image src="../../static/imgs/mine/user-vip.png" class="vipCard" @click="undeveloped"></image> -->
			</view>
		</view>
		<!--  :style="{ paddingTop: `${paddingTop}px`}" -->
		<view>
			<view class="order" style="display: none;">
				<view class="order-title text_black">我的订单</view>
				<view class="order-list">
					<view class="order-item" v-for="(item,index) in orderList" :key="index" @click="orderClick(item)">
						<image :src="item.img"></image>
						<view class="text_black">{{item.title}}</view>
					</view>
				</view>
			</view>
			<view class="teacher" @click="shareClick">
				<image src="../../static/imgs/mine/share.png"></image>
			</view>
			<view class="teacher" @click="releasePlanClick">
				<image src="../../static/imgs/mine/teacher.png"></image>
			</view>
			<view class="teacher" @click="certClick">
				<image src="../../static/imgs/mine/cert.png"></image>
			</view>
			<view class="order">
				<view class="order-title text_black">其他功能</view>
				<view class="function-list">
					<view class="function-item" v-for="(item,index) in functionList" @click="gohref(item)">
						<image :src="item.img"></image>
						<view class="text_black">{{item.title}}</view>
					</view>
				</view>
			</view>
		</view>
		<share ref="share"></share>
	</view>
</template>

<script>
	import {
		getUser
	} from "../../static/js/api/user.js";
	import Cache from "../../static/js/cache.js";
	import share from "../../components/share/index.vue";
	export default {
		components: {
			share
		},
		data() {
			return {
				statusBarHeight: 0,
				paddingTop: 0,
				userInfo: {},
				bindInfo: {},
				orderList: [{
					img: require('../../static/imgs/mine/allorder.png'),
					title: "全部",
				}, {
					img: require('../../static/imgs/mine/nopay.png'),
					title: "待支付",
				}, {
					img: require('../../static/imgs/mine/paysuccess.png'),
					title: "已支付",
				}, {
					img: require('../../static/imgs/mine/quxiao.png'),
					title: "已取消",
				}],
				functionList: [{
					href: "/pages/mine/studyAndcollect?type=study",
					img: require('../../static/imgs/mine/watch.png'),
					title: "观看记录",
				}, {
					href: "/pages/mine/studyAndcollect?type=collect",
					img: require('../../static/imgs/mine/collect.png'),
					title: "我的收藏",
				}, {
					href: "/pages/home/about?url=https://api.aobeitineng.com/user/about",
					img: require('../../static/imgs/mine/about.png'),
					title: "关于我们",
				}, {
					href: "/pages/mine/account",
					img: require('../../static/imgs/mine/setting.png'),
					title: "系统设置",
				}, ],
			}
		},

		onShow() {
			let platform = uni.getSystemInfoSync().platform
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			if (platform == 'ios') {
				// this.paddingTop = this.statusBarHeight + 203;
				this.paddingTop = this.statusBarHeight + 80;
			} else {
				// this.paddingTop = this.statusBarHeight + 175;
				this.paddingTop = this.statusBarHeight + 70;
			}
			console.log(110, this.statusBarHeight)
			if (Cache.cache.get('token')) {
				this.getUserMsg()
			} else {
				uni.navigateTo({
					url: "/pages/login/index"
				})
			}
		},
		methods: {
			getUserMsg() {
				getUser().then(res => {
					console.log(res)
					this.userInfo = res.user
					this.bindInfo = res.bind_default
					Cache.cache.set('is_bind_school', res.is_bind_school)
				})
			},
			undeveloped() {
				uni.navigateTo({
					url: "/pages/mine/member"
				})
			},
			// 订单相关
			orderClick(item) {
				uni.showToast({
					icon: "none",
					title: "目前处于限免阶段"
				})
			},
			// 其他功能点击
			gohref(item) {
				if (Cache.cache.get('token')) {
					uni.navigateTo({
						url: item.href
					})
				} else {
					uni.navigateTo({
						url: "/pages/login/index"
					})
				}

			},
			// 体育教师点击
			releasePlanClick() {
				if (Cache.cache.get('token')) {
					if (this.userInfo.teacher_id != '0') {
						uni.navigateTo({
							url: "/pages/releasePlan/index?schooldId=" + this.bindInfo.student_id
						})
					} else {
						uni.showToast({
							icon: "none",
							title: "仅对接入校园体能的体育老师开放此功能"
						})
					}
				} else {
					uni.navigateTo({
						url: "/pages/login/index"
					})


				}
			},
			// 我的荣誉
			certClick(){
				if (Cache.cache.get('token')) {
					uni.navigateTo({
						url: "/pages/mine/certificate"
					})
				} else {
					uni.navigateTo({
						url: "/pages/login/index"
					})
				}
			},
			// 分享
			shareClick() {
				this.$refs.share.open()
			},
			hrefAccount() {
				if (Cache.cache.get('token')) {
					uni.navigateTo({
						url: "/pages/mine/user"
					})
				} else {
					uni.navigateTo({
						url: "/pages/login/index"
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("./index.scss");

	.header-msg_tips,
	.list-item-tips {
		color: $uni-text-color-black;
	}

	.header-msg_num,
	.list-item-title {
		color: $uni-text-color-black;
	}

	.left {
		margin-left: 0 !important;
	}
</style>